<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>
        列表
    </title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="css/main.css" media="all">
    <script type="text/javascript" src="lib/loading/okLoading.js"></script>
    <link rel="stylesheet" href="css/bootstrap.css">
</head>

<body>
    <div class="x-nav">
        <span class="layui-breadcrumb">
            <a><cite>首页</cite></a>
            <a><cite>财务业务</cite></a>
            <a><cite>资金流水</cite></a>
        </span>
        <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
            href="javascript:location.replace(location.href);" title="刷新"><i class="layui-icon"
                style="line-height:30px">ဂ</i></a>
    </div>
    <div class="x-body">
        <div class="row">
            <div class="col-xs-6 col-sm-4 col-md-2">
                <section class="panel">
                    <div class="symbol bgcolor-blue"> <i class=" iconfont icon-dashaxiaoqudizhi01"></i>
                    </div>
                    <div class="value tab-menu" bind="1">
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="本月收款总额（元）"><i
                                class="iconfont " data-icon=""></i>
                            <h1>45</h1>
                        </a>
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="本月收款总额（元）"> <i
                                class="iconfont " data-icon=""></i><span>本月收款总额（元）</span></a>
                    </div>
                </section>
            </div>
            <div class="col-xs-6 col-sm-4 col-md-2">
                <section class="panel">
                    <div class="symbol bgcolor-blue"> <i class="iconfont icon-dashaxiaoqudizhi01"></i>
                    </div>
                    <div class="value tab-menu" bind="1">
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="本月付款总额（元）"> <i
                                class="iconfont " data-icon=""></i>
                            <h1>600</h1>
                        </a>

                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="本月付款总额（元）"> <i
                                class="iconfont " data-icon=""></i><span>本月付款总额（元）</span></a>

                    </div>
                </section>
            </div>

            <div class="col-xs-6 col-sm-4 col-md-2">
                <section class="panel">
                    <div class="symbol bgcolor-commred"> <i class="iconfont icon-dashaxiaoqudizhi01"></i>
                    </div>
                    <div class="value tab-menu" bind="1">
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="历史收款总额（元）"> <i
                                class="iconfont " data-icon=""></i>
                            <h1>8310</h1>
                        </a>
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="历史收款总额（元）"> <i
                                class="iconfont " data-icon=""></i><span>历史收款总额（元）</span></a>
                    </div>
                </section>
            </div>

            <div class="col-xs-6 col-sm-4 col-md-2">
                <section class="panel">
                    <div class="symbol bgcolor-commred"><i class="iconfont icon-dashaxiaoqudizhi01"></i>
                    </div>
                    <div class="value tab-menu" bind="1">
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="历史付款总额（元）"> <i
                                class="iconfont " data-icon=""></i>
                            <h1>1314</h1>
                        </a>
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="历史付款总额（元）"> <i
                                class="iconfont " data-icon=""></i><span>历史付款总额（元）</span></a>
                    </div>
                </section>
            </div>
            <div class="col-xs-6 col-sm-4 col-md-2">
                <section class="panel">
                    <div class="symbol bgcolor-yellow-green"> <i class="iconfont icon-dashaxiaoqudizhi01"></i>
                    </div>
                    <div class="value tab-menu" bind="1">
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="本月借款总额（元）"> <i
                                class="iconfont " data-icon=""></i>
                            <h1>1314</h1>
                        </a>
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="本月借款总额（元）"> <i
                                class="iconfont " data-icon=""></i><span>本月借款总额（元）</span></a>
                    </div>
                </section>
            </div>
            <div class="col-xs-6 col-sm-4 col-md-2">
                <section class="panel">
                    <div class="symbol bgcolor-yellow-green"> <i class="iconfont icon-dashaxiaoqudizhi01"></i>
                    </div>
                    <div class="value tab-menu" bind="1">
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="本月还款总额（元）"> <i
                                class="iconfont " data-icon=""></i>
                            <h1>1314</h1>
                        </a>
                        <a href="javascript:;" data-url="user-info.html" data-parent="true" data-title="本月还款总额（元）"> <i
                                class="iconfont " data-icon=""></i><span>本月还款总额（元）</span></a>
                    </div>
                </section>
            </div>

        </div>

        <div class="main_box">
            <div class="panel-heading">
                <ul class="nav nav-tabs" id="navTabs">
                    <li><a class="receivePane" data-tab="" href="capitalflow_sk.html">收款流水</a></li>
                    <li  class="active"><a class="payPane" data-tab="" href="paymentflow.html">付款流水</a></li>
                    <li class=""><a class="borrowPane" data-tab="" href="#">借款流水</a></li>
                    <li class=""><a class="repayPane" data-tab="" href="#">还款流水</a></li>
                    <li class=""><a class="cashAccountAllPane" data-tab="" href="#">资金汇总</a></li>
                    <li class=""><a class="cashRecordPane" data-tab="" href="#">余额变动</a></li>
                </ul>
            </div>
        </div>

        <form class="layui-form x-center" action="">
            <div class="layui-form-pane" style="margin-top: 15px;">
                <div class="layui-form-item">
                    <label class="layui-form-label">日期范围</label>
                    <div class="layui-input-inline">
                        <input class="layui-input" placeholder="开始日" id="LAY_demorange_s">
                    </div>
                    <div class="layui-input-inline">
                        <input class="layui-input" placeholder="截止日" id="LAY_demorange_e">
                    </div>
                    <div class="layui-input-inline">
                        <input type="text" name="username" placeholder="请输入登录名" autocomplete="off" class="layui-input">
                    </div>


                    <div class="layui-input-inline">
                        <select name="modules" lay-verify="required" lay-search="">
                            <option value="">资金账户</option>
                            <option value="1">layer</option>
                            <option value="2">form</option>
                            <option value="3">layim</option>
                            <option value="4">element</option>
                            <option value="5">laytpl</option>
                            <option value="6">upload</option>
                            <option value="7">laydate</option>
                            <option value="8">laypage</option>
                            <option value="9">flow</option>
                            <option value="10">util</option>
                            <option value="11">code</option>
                            <option value="12">tree</option>
                            <option value="13">layedit</option>
                            <option value="14">nav</option>
                            <option value="15">tab</option>
                            <option value="16">table</option>
                            <option value="17">select</option>
                            <option value="18">checkbox</option>
                            <option value="19">switch</option>
                            <option value="20">radio</option>
                        </select>

                    </div>
                    <div class="layui-input-inline">
                        <select name="modules" lay-verify="required" lay-search="">
                            <option value="">款项类型</option>
                            <option value="1">layer</option>
                            <option value="2">form</option>
                            <option value="3">layim</option>
                            <option value="4">element</option>
                            <option value="5">laytpl</option>
                            <option value="6">upload</option>
                            <option value="7">laydate</option>
                            <option value="8">laypage</option>
                            <option value="9">flow</option>
                            <option value="10">util</option>
                            <option value="11">code</option>
                            <option value="12">tree</option>
                            <option value="13">layedit</option>
                            <option value="14">nav</option>
                            <option value="15">tab</option>
                            <option value="16">table</option>
                            <option value="17">select</option>
                            <option value="18">checkbox</option>
                            <option value="19">switch</option>
                            <option value="20">radio</option>
                        </select>

                    </div>

                    <div class="layui-inline" style="float: left;">
                        <label class="layui-form-label">范围</label>
                        <div class="layui-input-inline" style="width: 100px;">
                            <input type="text" name="price_min" placeholder="￥" autocomplete="off" class="layui-input">
                        </div>
                        <div class="layui-form-mid">-</div>
                        <div class="layui-input-inline" style="width: 100px;">
                            <input type="text" name="price_max" placeholder="￥" autocomplete="off" class="layui-input">
                        </div>
                    </div>


                    <div class="layui-input-inline">
                        <input type="text" name="fkdw" placeholder="付款单位" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-input-inline" style="width:80px">
                        <button class="layui-btn" lay-submit="" lay-filter="sreach"><i
                                class="layui-icon">&#xe615;</i></button>
                    </div>
                </div>
            </div>
        </form>
        <xblock>
            <button class="layui-btn layui-btn-danger" onclick="delAll()"><i
                    class="layui-icon">&#xe640;</i>批量删除</button>
            <button class="layui-btn" onclick="admin_add('添加','CapitalFlow_skadd.html','1000','600')"><i
                    class="layui-icon">&#xe608;</i>添加</button>

        </xblock>
        <table class="layui-table">
            <thead>
                <tr>
                    <th>
                        <input type="checkbox" name="" value="">
                    </th>
                    <th>
                        ID
                    </th>

                    <th>
                        性质
                    </th>
                    <th>
                        付款金额
                    </th>
                    <th>
                        收支途径
                    </th>
                    <th>
                        收款日期
                    </th>
                    <th>
                        付款单位
                    </th>
                    <th>
                        款项类型
                    </th>
                    <th>
                        关联项目
                    </th>
                    <th>
                        资金账户
                    </th>
                    <th>
                        关联凭据
                    </th>
                    <th>
                        关联合同
                    </th>
                    <th>
                        摘要备注
                    </th>
                    <th>
                        经手人
                    </th>
                    <th>
                        添加人
                    </th>
                    <th>
                        操作
                    </th>
                </tr>
            </thead>
            <tbody id="x-img">
                <tr>
                    <td>
                        <input type="checkbox" value="1" name="">
                    </td>
                    <td>
                        1 </td>

                    <td>
                        付款
                    </td>
                    <td>
                       -150 </td>
                    <td>
                        现金 </td>
                    <td>
                        2021-1-20 </td>
                    <td>
                        相王科技 </td>
                    <td>
                        其他费用</td>
                    <td>
                        电梯系统 </td>
                    <td>
                       建行个人
                    </td>
                    <td>
                        XX市房产开发有限公司 </td>
                    <td>
                       销售合同 </td>
                    <td>
                       132456 </td>

                    <td >
                        555
                    </td>
                    <td style="text-align: center;">
                        cxy
                        <br>
                        2021-1-20
                    </td>
                    <td class="td-manage">

                        <a title="编辑" href="javascript:;"
                            onclick="community_edit('编辑','CapitalFlow_skadd.html','2','1000','600')" class="ml-5"
                            style="text-decoration:none">
                            <i class="layui-icon">&#xe642;</i>
                        </a>
                        <a title="删除" href="javascript:;" onclick="admin_del(this,'1')" style="text-decoration:none">
                            <i class="layui-icon">&#xe640;</i>
                        </a>
                    </td>
                </tr>


            </tbody>
        </table>

        <div id="page">
            <ul class="pagination">
                <li class="disabled"><span>&laquo;</span></li>
                <li class="active"><span>1</span></li>
                <li><a href="/xiyuan/Community/lst?page=2">2</a></li>
                <li><a href="/xiyuan/Community/lst?page=2">&raquo;</a></li>
            </ul>
        </div>
    </div>
    <script src="lib/layui/layui.js" charset="utf-8"></script>
    <script src="js/x-layui.js" charset="utf-8"></script>
    <script>






        layui.use(['laydate', 'element', 'laypage', 'layer', 'form'], function () {
            $ = layui.jquery;//jquery
            laydate = layui.laydate;//日期插件
            lement = layui.element();//面包导航
            laypage = layui.laypage;//分页
            layer = layui.layer;//弹出层
            var form = layui.form();
            okLoading.close($);
            //以上模块根据需要引入

            /*laypage({
              cont: 'page'
              ,pages: 100
              ,first: 1
              ,last: 100
              ,prev: '<em><</em>'
              ,next: '<em>></em>'
            }); */


            layer.ready(function () { //为了layer.ext.js加载完毕再执行
                layer.photos({
                    photos: '#x-img'
                    //,shift: 5 //0-6的选择，指定弹出图片动画类型，默认随机
                });
            });



            var start = {
                max: '2099-06-16 23:59:59'
                , istoday: false
                , choose: function (datas) {
                    end.min = datas; //开始日选好后，重置结束日的最小日期
                    end.start = datas //将结束日的初始值设定为开始日
                }
            };

            var end = {

                 max: '2099-06-16 23:59:59'
                , istoday: false
                , choose: function (datas) {
                    start.max = datas; //结束日选好后，重置开始日的最大日期
                }
            };

            document.getElementById('LAY_demorange_s').onclick = function () {
                start.elem = this;
                laydate(start);
            }
            document.getElementById('LAY_demorange_e').onclick = function () {
                end.elem = this
                laydate(end);
            }

        });

        //批量删除提交
        function delAll() {
            layer.confirm('确认要删除吗？', function (index) {
                //捉到所有被选中的，发异步进行删除
                layer.msg('删除成功', { icon: 1 });
            });
        }
        /*添加*/
        function admin_add(title, url, w, h) {
            x_admin_show(title, url, w, h);
        }


        //编辑
        function community_edit(title, url, id, w, h) {
            url = url + "?id=" + id;
            x_admin_show(title, url, w, h);
        }
        /*删除*/
        function admin_del(obj, id) {
            layer.confirm('确认要删除吗？', { icon: 3, title: '提示信息' }, function (index) {
                $.ajax({
                    type: "post",
                    url: "/xiyuan/banner/banner_del.html",
                    data: {
                        userId:$userId,
                        id: id
                    },
                    headers: {
                        "token": $token,
                    },
                    dataType: "json",
                    success: function (data) {
                        //console.log(data);
                        if (data.status == 1) {
                            //发异步删除数据
                            $(obj).parents("tr").remove();
                            layer.msg(data.info, { icon: 6, time: 1000 });
                            setTimeout(function () {
                                window.location.reload();
                            }, 1000); return false;
                        } else {
                            layer.msg(data.info, { icon: 5, time: 1000 }); return false;
                        }
                    }
                });
                //发异步删除数据
                $(obj).parents("tr").remove();
                layer.msg('已删除!', { icon: 1, time: 1000 });
            });
        }



    </script>

</body>

</html>
